<style>
</style>
<template>
<div>
    <Card :bordered="false" dis-hover>
        <p slot="title">发票管理</p>
        <Row :gutter="20">
			<Col span="6">
				<Input v-model="search.invoiceNo" placeholder="发票号码" ></Input>
			</Col>
			<Col span="6">
				<Input v-model="search.orderNo" placeholder="订单号" ></Input>
			</Col>
			<Col span="6">
				<Input v-model="search.buyerName" placeholder="购买方" ></Input>
			</Col>
			<!-- <Col span="10">
				<DatePicker type="datetimerange" format="yyyy-MM-dd HH:mm"
				placeholder="开票日期" v-model="search.date" style="width:100%;"></DatePicker>
			</Col> -->
			<Col span="2">
				<Button type="primary" icon="ios-search"  @click="getdata('search')">搜索</Button>
			</Col>
        </Row><br/>
        <!-- <Checkbox v-model="single">销项自动验证</Checkbox> -->
        <div style="margin-top:20px;">

	   		<div class="ivu-table-wrapper" >
	            <div class="ivu-table ivu-table-with-fixed-top ">
	                <div class="ivu-table-body" >
	                    <table  class="table_border _table"   cellspacing="0" cellpadding="0" border="0" style="width: 100%;">

		                    <thead>
			                    <tr>
			                        <th class="" style="width:60px;">
			                        	<div class="ivu-table-cell">
			                        		<Checkbox v-model="check" lable="" @on-change="checkchange"></Checkbox>

			                        	</div>
			                        </th>
			                        <th class="" style="width:150px;">
			                            <div class="ivu-table-cell">
			                                <span>发票号</span>
			                            </div>
			                        </th>
			                        <th class="" style="width:90px;">
			                            <div class="ivu-table-cell">
			                                <span>开票日期</span>
			                            </div>
			                        </th>
			                        <th class="" style="width:100px;">
			                            <div class="ivu-table-cell">
			                                <span>操作人</span>
			                            </div>
			                        </th>
			                        <th class="" style="width:100px;">
			                            <div class="ivu-table-cell">
			                                <span>发票类型</span>
			                            </div>
			                        </th>
			                        <th class="" style="width:80px;">
			                            <div class="ivu-table-cell">
			                                <span>发票状态</span>
			                            </div>
			                        </th>
			                        <th class="" style="width:100px;">
			                            <div class="ivu-table-cell">
			                                <span>总金额&nbsp;(元)</span>
			                            </div>
			                        </th>
			                        <th class="">
			                            <div class="ivu-table-cell">
			                                <span>购买方名称 </span>
			                            </div>
			                        </th>
			                        <th class="" style="width:80px;">
			                            <div class="ivu-table-cell">
			                                <span>操作</span>
			                            </div>
			                        </th>
			                    </tr>
		                    </thead>
		                    <tbody class="ivu-table-tbody" v-for="item in data">
			                    <tr class="ivu-table-row">
			                        <td class="">
			                            <div class="ivu-table-cell">
			                        		<Checkbox v-model="item.check"
			                        		 name="radio_1"></Checkbox>
			                        	</div>
			                        </td>
			                        <td class="">
			                            <div class="ivu-table-cell">
			                                <span>{{item.invoice_no}}</span>
			                            </div>
			                        </td>
			                        <td class="">
			                            <div class="ivu-table-cell">
			                                <span>{{item.invoice_date  | formatDate('yyyy-MM-dd')}}</span>
			                            </div>
			                        </td>
			                        <td class="">
			                            <div class="ivu-table-cell">
			                                <span>{{item.drawer}}</span>
			                            </div>
			                        </td>
			                        <td class="">
			                            <div class="ivu-table-cell">
			                                <span>
			                                <!-- {{item.invoice_type_code | decode('fp')}} -->
			                                普票
			                            	</span>
			                            </div>
			                        </td>
			                        <td class="">
			                            <div class="ivu-table-cell">
			                                <span
			                                :class="item.invoice_status | decode('st_color') ">
			                                	{{item.invoice_status | decode('st')}}
			                            	</span>
			                            </div>
			                        </td>
			                        <td class="">
			                            <div class="ivu-table-cell">
			                                <span>{{item.invoice_total_price_tax}} </span>
			                            </div>
			                        </td>
			                        <td class="">
			                            <div class="ivu-table-cell">
			                                <span>{{item.buyer_name}}</span>
			                            </div>
			                        </td>
			                        <td class="">
			                            <div class="ivu-table-cell">
			                                <Button  size="small"
			                                 @click="_show(item)">
			                             	{{item.show?'收起':'详情'}}</Button>
			                            </div>
			                        </td>
			                    </tr>
			                    <tr class="tr_1" v-if="item.show">
			                        <td colspan="9">
			                        	<div style="margin:0px 20px;">
			                        		<table class="table_6b">
			                                <tbody>
			                                    <tr>
			                                        <td style="width:100px;">出库单单号：</td>
			                                        <td style="width:40%;">
			                                        	<a>{{item.list.billno}}</a></td>

			                                        <td style="width:100px;">快递状态:</td>
			                                        <td>
			                                        	<span :class="item.express_state | decode('express_color')">

			                                        		{{item.express_state |decode('express')}}
			                                        	</span>
			                                        	<!-- <span class="spanc_l">
			                                        		已签收
			                                        	</span> -->

			                                        </td>
			                                    </tr>
			                                    <tr>
			                                        <td>进项发票号:</td>
			                                        <td>

			                                        	<span v-for="is in item.list.incomeInvoice">
			                                        		<a>{{is.invoiceNo}}</a>&nbsp;&nbsp;&nbsp;
			                                        	</span>


			                                        </td>
			                                        <td>发票验证结果：</td>
			                                        <td :class="item.check_flag |decode('flag_color')">
			                                        	{{item.check_flag |decode('flag')}}
			                                    	</td>
			                                    </tr>
			                                    <tr>
			                                    	<td colspan="4">
			                                    		<Button type="primary" size="small" @click="_print(item.download_url)">
        													发票下载(蓝票）</Button>
												        <Button type="primary" size="small" @click="show(1,$event,item)">发送邮件</Button>

												        <Button type="primary" size="small"
												        @click="show_exp(item.guid)"
												        v-if="item.express_state==0 || item.express_state==null ">快递邮寄</Button>
												         <Button size="small" type="primary" @click="show_pro(item)"
												         v-else>快递跟踪</Button >

												        <Button type="primary" size="small"
												        v-if="item.invoice_status!=1"
												        @click="show_hc(item)" >红冲</Button>

														<Button type="primary" size="small"
												        v-else
												        @click="show_fs(item)" >发票下载（红票)</Button>


												    </td>
			                                    </tr>
			                                </tbody>
			                            </table>
			                        	</div>
			                        </td>
			                    </tr>
		                    </tbody>
	                    </table>
	                    <div class="body_empty" v-if="data.length==0">
	                    	暂无数据
	                    </div>
	                </div>
	            </div>

	        </div>
	   	</div>
        <p style="margin-top:10px;">
        	<!-- item.download_url -->
        	<Button type="primary" size="small" @click="print()">
        	发票下载</Button>


	        <!-- <Button type="primary">作废</Button> -->

	        <!-- <Button type="primary">验证发票</Button> -->
	        <Page  show-total :page-size="page.pageSize" :current="search.currentpage"	:total="page.total"
       		show-total @on-change="changePage" style="float:right;"></Page>
        </p>

    </Card>
    <admin-edit @refresh="refresh"></admin-edit>
    <express-edit @refresh="refresh"></express-edit>
    <progres-edit ></progres-edit>

</div>
</template>
<script>
import AdminEdit from "../Module/adminedit.vue";
import ExpressEdit from "../Module/expressedit.vue";
import ProgresEdit from "../Module/progresedit.vue";

export default {
  components: { AdminEdit, ExpressEdit, ProgresEdit },
  myOption: "admin",
  data() {
    return {
      check: false,
      price: true,
      single: false,

      states: ["已开", "已作废", "已红冲", "已开"],
      types: ["", "普票"],
      colors: ["yellow", "blue"],
      data: [],
      page: { pageSize: 10, total: 0 },
      search: { currentpage: 0, orderNo: null, buyerName: null }
    };
  },
  methods: {
    show(h, event, item) {
      this.$bus.emit("bus_adminedit", item);
    },
    changePage(pageNum) {
      this.search.currentpage = pageNum;
      this.getdata();
    },
    checkchange(item) {
      this.data.forEach(function(val) {
        val.check = item;
      });
    },
    singlechange(item) {
      this.data.forEach(function(val) {
        val.single = item;
      });
    },
    show_exp(guid) {
      this.$bus.emit("bus_expressedit", guid);
    },
    refresh() {
      this.getdata();
    },
    show_pro(item) {
      this.$emit("bus_progressedit", item);
    },
    getdata(type) {
      if (type == "search") {
        this.search.currentpage = 1;
      }
      this.axios.post("/invoice/output/findByPage", this.search).then(res => {
        var d = res.data.list;
        for (var i = 0; i < d.length; i++) {
          d[i].show = false;
        }
        this.data = d;
        this.page.total = res.data.total;
        this.search.currentpage = res.data.pageNo || 1;
      });
    },
    _show(item) {
      if (!item.list) {
        this.axios.post("/invoice/income/" + item.guid, {}).then(res => {
          item.list = res.data;
          item.show = !item.show;
        });
      } else {
        item.show = !item.show;
      }
    },
    _print(url) {
      var a = window.open(url, "下载");
      a.focus();
    },
    show_fs(item) {
      var a = window.open(item.red_download_url, "下载 ");
      a.focus();
    },
    print(url) {
      var a = [];
      this.data.forEach(function(val) {
        if (val.check) {
          a.push(val.download_url);
        }
      });
      if (a.length == 0) {
        this.$Message.error("请勾选");
      }
      this.axios.post("/invoice/zip", a, { timeout: 60 * 1000 }).then(res => {
        var u = process.env.host;

        if (u.indexOf("localhost") > -1) {
          //u='http://192.168.3.203:8086/'
          u = location.origin;
        }

        var a = window.open(u + "/" + res.data, "下载");
        a.focus();
      });
    },
    show_hc(item) {
      this.$Modal.confirm({
        title: "提示",
        content: "<p>确定红冲？</p>",
        loading: true,
        onOk: () => {
          this.axios
            .post("/outputinoivce/reverse", { invoiceGuid: item.guid })
            .then(res => {
              this.$Modal.remove();
              if (res.errorCode == 0) {
                this.$Message.success(res.message);
                this.getdata();
              } else {
                //this.$Message.error(res.message);
              }
            });
        }
      });
    }
  },
  mounted() {
    $("._table").resizableColumns({});
  },
  created() {
    this.getdata();
    this.axios.post("/invoice/express/company/all", {}).then(res => {
      this.$store.commit("SetExpress", { data: res.data });
    });
  },
  activated() {
    this.getdata();
  }
};
</script>
